<template>
  <div class="" style="background-color: #eee;">
    <div class="left-tree" style="margin-top: 10px;margin-left: 10px;">
      <ul id="treeDemo" class="ztree"></ul>
    </div>
    <div style="position: absolute;bottom:5px;right:20px;">
      <el-button type="primary" size="small" @click="submitZtreeMap()">确定</el-button>
      <!-- <el-button type="warning" size="small">取消</el-button> -->
    </div>
  </div>
</template>

<script>
import {getDeptTreeNode} from "@/api/xapply/gis/gridShow";

import $ from "@/assets/jquery-vendor.js";
import "@/assets/js/gis/jquery.ztree.core.js";
import "@/assets/js/gis/jquery.ztree.excheck.min.js";
import "@/assets/css/gis/zTreeStyle/zTreeStyle.css";

export default {
  name: 'gisZtree',
  props:['deptId'],
  data() {
    return {
      gridCode: '',
      gridName:'',
      gridId:'',
      treeobj:[]
    };
  },

  created() {
    this.init();
  },

  methods: {
    //加载左侧树
    init(){
      let setting = {data: {simpleData: {enable: true}}, callback: {onClick: this.treeClick}};
      getDeptTreeNode().then(res => {
          const result = res.data;
          $.fn.zTree.init($("#treeDemo"), setting, result.treeNodes);
      })
    },

    //树点击
    treeClick(event, treeId, treeNode) {
      console.log(treeNode);

      if (treeNode.pId == '0' || treeNode.pId == null) {
        console.log("进入111="+this.config.topDeptCode);
        this.gridCode = this.config.topDeptCode;
      }else {
        console.log("进入222="+treeNode.deptCode);
        this.gridCode = treeNode.deptCode;
      }

      let allPathName = this.getFilePath(treeNode);
      this.gridName = allPathName

      this.gridId = treeNode.id

      this.treeobj = treeNode
    },

    //获取子节点，所有父节点的name和id的拼接字符串
		getFilePath(treeObj){
			if(treeObj==null){
				return "";
			}
			let fileNames = treeObj.name;
			let pNode = treeObj.getParentNode();
			if(pNode!=null){
				fileNames = this.getFilePath(pNode) +"-"+ fileNames;
			}
			return fileNames;
		},

    //确定
    submitZtreeMap(){
      this.$emit('getZtreeMap',{'gridCode':this.gridCode,'gridName':this.gridName,'treeobj':this.treeobj,'gridId':this.gridId});
    }
  },
  beforeDestroy() {
    if (this.view) {
      this.view.container = null
    }
  },
}

</script>

<style lang="scss" scoped>

</style>
